<template>
  <div>

    <el-container>
      <el-aside width="200px" >
        <el-row class="tac">
          <el-col>

            <el-menu default-active="2" :router=true class="el-menu-vertical-demo" >

              <el-menu-item index="/home/repair/problem">
                <i class="el-icon-s-cooperation"></i>
                事件单
              </el-menu-item>
              <el-menu-item index="/home/repair/messages">
                <i class="el-icon-question"></i>
                问题单
              </el-menu-item>
              <el-menu-item index="/home/repair/change">
                <i class="el-icon-s-order"></i>
               变更单
              </el-menu-item>
              
              <el-submenu index="">
                <template slot="title">
                  <span>统计分析</span>
                </template>
                <el-menu-item index="/home/repair/Persontotal">
                  <i class="el-icon-s-marketing"></i>
                个人分析
                </el-menu-item>
              </el-submenu>
              
              
              <el-menu-item index="/home/repair/Zdpz">
                <i class="el-icon-s-cooperation"></i>
                字段配置
              </el-menu-item>
              <el-menu-item index="/home/repair/Gdmb">
                <i class="el-icon-question"></i>
                工单模板
              </el-menu-item>
              <el-menu-item index="/home/repair/Lcpz">
                <i class="el-icon-s-order"></i>
               流程配置
              </el-menu-item>

            </el-menu>
          </el-col>

        </el-row>

      </el-aside>
      <el-container>

        <el-main style="background-color: white">
          <RouterView></RouterView>
        </el-main>
      </el-container>
    </el-container>


  </div>
</template>

<script>
import { RouterView } from 'vue-router';
export default { components: { RouterView } };
</script>

<style scoped>
.el-header,
.el-footer {
  background-color: #B3C0D1;
  color: #333;
  text-align: center;
  line-height: 60px;
}

.el-aside {
  background-color: #D3DCE6;
  color: #333;
  text-align: center;
  line-height: 200px;
  height: 900px;
}

.el-main {
  background-color: #E9EEF3;
  color: #333;
  text-align: center;
  line-height: 50px;
  height: 100%;
  padding: 0;
}

body>.el-container {
  margin-bottom: 30;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}

.no-link-style {
  text-decoration: none;
  color: inherit;
}
::v-deep .el-menu {
  background-color: #D3DCE6;
}
</style>